<template>
    <div class="classifyPost">
      <hotGroup :hotGroup="hotGroup" :background="true" @changeStatus="changeStatus"></hotGroup>
      <bottoms></bottoms>
    </div>
</template>

<script>
  import hotGroup from '@/components/group/hotGroup'
  import bottoms from '@/components/reachBottom/index'
    export default {
        name: "classifyPost",
      components:{
        hotGroup,
        bottoms
      },
      data(){
          return{
            id: "",
            hotGroup:[],
            loadingEnd:{
              moduleOne: false,
            },
            totalPage: 1,
            currentPage: 1
          }
      },
      methods:{
        getGroupList(){
          this.$ajax
            .post(this.$api.groupList,{group_cat_id:this.id, page: this.currentPage})
            .then(res => {
              this.hotGroup.push(...res.data);
              this.loadingEnd.moduleOne = true;
              this.totalPage = res.total_page;
              if(res.total_count === 0){
                this.$store.dispatch("changeIsEmpty", true);
              } else {
                this.$store.dispatch("changeIsEmpty", false);
              }
            })
            .catch(err => {
              this.loadingEnd.moduleOne = true;
              ﻿uni.showToast({
                title: err,
                icon: 'none',
                duration: 2000
              })
            });
        },
        changeStatus(index){
          this.hotGroup[index].is_add = 'yes'
        },
        viewLoad(){
          this.$store.dispatch("changeIsMore", false);
          this.$store.dispatch("changeIsEnd", false);
          this.$store.dispatch("changeIsEmpty", false);
          this.hotGroup=[];
          this.totalPage = 1;
          this.currentPage = 1;
          this.loadingEnd = {
            moduleOne: false,
          };
          ﻿uni.showLoading({
            title: '加载中',
            mask: true
          });
          this.getGroupList();
        }
      },
      computed:{
        hideLoading(){
          if(this.loadingEnd.moduleOne){
            setTimeout(function(){
              ﻿uni.hideLoading()
            }, 800)
          }
        }
      },
      onPullDownRefresh(){
        this.viewLoad();
        ﻿uni.stopPullDownRefresh() //停止下拉刷新
      },
      onReachBottom(){
        if(this.totalPage > this.currentPage){
          this.$store.dispatch("changeIsMore", true);
          this.$store.dispatch("changeIsEnd", false);
          this.currentPage++
          this.getGroupList();
        } else {
          this.$store.dispatch("changeIsEnd", true);
          this.$store.dispatch("changeIsMore", false);
        }
      },
      onLoad(res){
        this.id = res.id;
        this.viewLoad();
        ﻿uni.setNavigationBarTitle({
          title: res.title
        })
      }
    }
</script>

<style scoped>
.classifyPost{
  padding: 0 30rpx;
}
</style>
